const path = require("path");
const webpack = require("webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const CopyPlugin = require("copy-webpack-plugin");
const ManifestPlugin = require("webpack-manifest-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");

const ASSET_PATH = process.env.ASSET_PATH || "/lovers/";

module.exports = {
  entry: "./src/index.js",
  output: {
    publicPath: ASSET_PATH,
    filename: "[hash].bundle.js",
    path: path.resolve(__dirname, "dist/lovers/")
  },
  devtool: "inline-source-map",
  plugins: [
    new CleanWebpackPlugin(),
    new CopyPlugin([
      {
        from: path.resolve(__dirname, "public"),
        to: "public"
      }
    ]),
    new HtmlWebpackPlugin({
      title: "my demo",
      template: "index.html"
    }),
    new ManifestPlugin(),
    new ExtractTextPlugin("main.css"),
    new webpack.ProvidePlugin({
      "window.jQuery": "jquery",
      $: "jquery",
      jQuery: "jquery"
    })
  ],
  resolve: {
    extensions: [".js", ".json", ".jsx", ".tsx", ".ts"],
    alias: {
      "~": path.resolve(__dirname, "./"),
      "@": path.resolve(__dirname, "./src")
    }
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          fallback: "style-loader",
          use: "css-loader"
        })
        // use: [
        //   { loader: "style-loader" },
        //   { loader: "css-loader" },
        //   { loader: "less-loader" },
        //   { loader: "file-loader", options: {} }
        // ]

        // use: ["style-loader", "css-loader", "less-loader"]
      },
      {
        test: /\.(png|jpg|jpeg|gif)$/,
        use: [
          {
            loader: "file-loader",
            options: {}
          }
        ]
      },
      {
        test: /\.html$/,
        use: [
          {
            loader: "html-loader",
            options: {
              minimize: true,
              removeComments: false,
              collapseWhitespace: false
            }
          }
        ]
      },
      {
        test: /\.mp3$/,
        use: [
          {
            loader: "file-loader",
            options: {}
          }
        ]
      },
      {
        test: /\.tsx?$/,
        use: "ts-loader",
        exclude: /node_modules/
      }
      //   {
      //     test: /\.json$/,
      //     exclude: /node_modules/,
      //     loader: "json-loader"
      //   }
    ]
  },
  devServer: {
    contentBase: "./dist"
  }
};
